import {Tab, Tabs} from 'nextra-theme-docs';
import Card from 'components/Card';
import Cards from 'components/Cards';
import Callout from 'components/Callout';
import Steps from 'components/Steps';
import Details from 'components/Details';

# Next.js App Router Internationalization (i18n)

You can pick from two options when setting up an app with `next-intl` and Next.js' App Router, depending on if you'd like to use unique pathnames for every language that your app supports.

<Cards className="mt-8 max-w-[550px]">
  <Card
    title="With i18n routing"
    href="/docs/getting-started/app-router/with-i18n-routing"
  >
    Uses a top-level `[locale]` segment for prefixed pathnames like `/en/about`
    or domain-based routing like `en.example.com/about`
  </Card>
  <Card
    title="Without i18n routing"
    href="/docs/getting-started/app-router/without-i18n-routing"
  >
    Useful if you'd like to provide a locale to `next-intl`, e.g. based on user
    settings, or if your app only supports a single language
  </Card>
</Cards>

To get a sense of what kind of setup you'd like to use, you can also explore the [example apps](/examples).
